/**
 * Created by sfr on 2017/10/10.
 */
import React from "react";
import {connect} from "dva";
import { routerRedux } from 'dva/router';
import moment from 'moment';
import {Carousel, WhiteSpace} from "antd-mobile";
import styles from './photoDetail.less'
const empty = require('is-empty');

import activity1 from '../../../assets/news/activity1.jpg';
import activity2 from '../../../assets/news/activity2.jpg';
import activity3 from '../../../assets/news/activity3.jpg';
import activity4 from '../../../assets/news/activity4.jpg';
import activity5 from '../../../assets/news/activity5.jpg';
import activity6 from '../../../assets/news/activity6.jpg';


class PhotoDetail extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      data: [activity1, activity2, activity3, activity4, activity5, activity6],
      initialCarouselHeight: '0rem',
      screenHeight: 0,//屏幕高度
      devicePixelRatio: 1,//设备像素比
    };
  }
  //== 生命周期 -- 组件将要加载
  componentWillMount() {
    this.setState({
      screenHeight: window.screen.height,
      devicePixelRatio: window.devicePixelRatio
    })
  }
  //==生命周期--页面渲染
  render() {
    const {screenHeight,devicePixelRatio} = this.state;
    return (
      <div className='PhotoDetail' style={{backgroundColor: '#000',height:`${(screenHeight-62)*devicePixelRatio}px`,overflow: 'hidden',position: 'relative'}}>
        <div style={{height: `${this.state.initialCarouselHeight}`}} className={styles.imgBox}>
          <Carousel
            className={styles.myCarousel}
            autoplay={false}
            infinite={true}
            selectedIndex={0}
            swipeSpeed={35}
            dots={true}
            afterChange={index => {this.setState({carouselNumber1: index+1})}}>
            {this.state.data.map((ii,jj) => (
              <a key={jj} className={styles.myCarouselA}>
                <img
                  className={styles.myCarouselAImg}
                  src={ii}
                  onLoad={() => {
                  window.dispatchEvent(new Event('resize'));
                    this.setState({
                      initialCarouselHeight: '5rem'
                    });
                  }}
                />
              </a>
            ))}
          </Carousel>
        </div>
      </div>
    );
  }
  //==组件所有函数
}

function mapStateToProps({ infor }){
  return {
    infor
	};
}
export default connect(mapStateToProps)(PhotoDetail);